<template>
  <div class="pfull studio elm-edit">
    <div style="height: 100px;background-color: #fff;border-radius: 4px;margin-bottom: 12px;">
      <div :style="{backgroundImage: 'url(/res/上.svg)',backgroundSize:'50%',backgroundRepeat:'no-repeat',height:'100px'}">
        <div style=" line-height:100px;width: 90px;float: left;text-align: center;">流程中心</div>
        <div style="float: left;height: 35px;width: 1px;background-color: #ddd;margin-top: 32px;"></div>
        <template v-for="item in flowList">
          <elm-open-button url="/system/flow/one_road_flowsec_form_s" width="1000" height="90%" :title="'发起'+item.title+'流程'" type="text"
                           :data="{'page_type':'create','flow_code':item.code}">
          <div style="height:100px;min-width: 60px;float: left;text-align: center;margin-left: 15px;margin-right: 15px;">
            <div style="margin-top:20px;font-size: 30px;line-height: 30px;color: rgb(109,201,155)">
              <img :src="item.icon + '?token=' + elm.info.token" style="height: 28px;max-width: 36px" alt="" onerror="this.onerror=null; this.src='/res/lczx.png';"/>
            </div>
            <div style="line-height: 16px;font-size: 14px;">{{item.title}}</div>
          </div></elm-open-button>
        </template>
<!--        <div style="position: absolute;right: 90px;top:-5px;cursor: pointer">-->
<!--          <el-button type="text" @click="openList('qywh')">-->
<!--            <div style="height:100px;min-width: 60px;float: left;text-align: center;margin-left: 15px;margin-right: 15px;">-->
<!--              <div style="margin-top:20px;font-size: 30px;line-height: 30px;color: rgb(109,201,155)">-->
<!--                <img src="/res/ymxx.svg" style="height:32px;"/>-->
<!--              </div>-->
<!--              <div style="line-height: 16px;">阳明心学</div>-->
<!--            </div>-->
<!--          </el-button>-->
<!--        </div>-->
<!--        <div style="position: absolute;right: 10px;top:0px;">-->
<!--          <elm-open-button-->
<!--              url="help_video" width="600" height="400" :title="'帮助'" type="text">-->
<!--            <div style="height:100px;min-width: 60px;float: left;text-align: center;margin-left: 15px;margin-right: 15px;">-->
<!--              <div style="margin-top:20px;font-size: 30px;line-height: 30px;color: rgb(109,201,155)">-->
<!--                <img src="/res/help-icon.svg" style="height:32px;"/>-->
<!--              </div>-->
<!--              <div style="line-height: 16px;font-size: 14px;">帮助视频</div>-->
<!--            </div>-->
<!--          </elm-open-button>-->
<!--        </div>-->
      </div>
    </div>
    <div style="height: calc(50% - 56px);">
      <div style="width: calc(70% - 6px);margin-right: 6px;float: left;margin-bottom: 12px;height: 100%;">
        <el-card class="dbyb">
          <div slot="header">
            <el-radio-group v-model="showTaskStatus" size="mini">
              <el-radio-button :label="'running'">待办</el-radio-button>
              <el-radio-button :label="'completed'">已办</el-radio-button>
            </el-radio-group>
          </div>
          <div style="height:100%;display: flex;overflow: auto">
            <elm-table ref="task_running" v-if="showTaskStatus=='running'" url="/system/login/flow/GetUserTaskRunning" :post-data="postData"
                       height="100%" :show-index="false" style="max-width: 100%">
              <el-table-column prop="sys_code_key" label="待办号" width="120px"  align="center"></el-table-column>
              <el-table-column prop="flow_title" label="流程"  align="center"></el-table-column>
              <el-table-column prop="create_emp_name" label="发起人" align="center" width="75px"></el-table-column>
              <el-table-column prop="title" label="节点" header-align="center"></el-table-column>
              <el-table-column prop="create_time" label="开始时间" width="160px" :formatter="formatDateTime" align="center"></el-table-column>
              <el-table-column label="当前节点" width="160px" align="center">
                <template v-slot="scope">
                  <elm-open-button v-if="scope.row.type == 'flow_task' && !em(scope.row.nodeins_id)"
                                   url="/system/flow/flow_canvas" theme="white" :full="false" width="90%" height="90%" title="节点信息"
                                   :data="{'show_flowins':'yes','flow_code':scope.row.flow_code,'data_id':scope.row.id}"
                                    type="text">
                    {{scope.row.nodeins_status=='completed'?'流程已完成':scope.row.title}}</elm-open-button>
                  <span v-if="scope.row.type == 'yw_task'">任务办理</span>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="80px" align="center">
                <template v-slot="scope">
                  <elm-open-button :url="scope.row.url" width="1000" height="90%" title="办理"
                                   :data="{'page_type':'edit','flow_code':scope.row.flow_code,'model':scope.row,'table_ref':'gzsx_completed'}"
                                   type="text">办理</elm-open-button>
                </template>
              </el-table-column>
            </elm-table>
            <elm-table ref="task_completed" v-if="showTaskStatus=='completed'" url="/system/login/flow/GetUserTaskCompleted" :post-data="postData"
                       height="100%"  :show-index="false" style="max-width: 100%">
<!--              <el-table-column prop="sys_code_key" label="实例号" width="190px"  align="center"></el-table-column>-->
              <el-table-column prop="flow_title" label="流程"  align="center"></el-table-column>
              <el-table-column prop="create_emp_name" label="发起人" align="center" width="75px"></el-table-column>
              <el-table-column prop="title" label="节点" header-align="center"></el-table-column>
              <el-table-column prop="create_time" label="开始时间" width="160px" :formatter="formatDateTime" align="center"></el-table-column>
              <el-table-column prop="status_time" label="完成时间" width="160px" :formatter="formatDateTime" align="center"></el-table-column>
              <el-table-column label="当前节点" width="120px" align="center">
                <template v-slot="scope">
                  <elm-open-button url="/system/flow/flow_canvas" theme="white" :full="false" width="90%" height="90%" title="节点信息"
                                   :data="{'show_flowins':'yes','flow_code':scope.row.flow_code,'data_id':scope.row.id}"
                                   v-if="!em(scope.row.nodeins_id)" type="text">
                    {{scope.row.nodeins_status=='completed'?'流程已完成':scope.row.title}}</elm-open-button>
                </template>
              </el-table-column>
            </elm-table>
          </div>
        </el-card>
      </div>
      <div style="width: calc(30% - 6px);margin-left: 6px;float: right;height:100%;">
        <el-card class="xxlist">
          <div slot="header">
            <span>通知公告</span>
            <right style="cursor: pointer;" @click.native="openList('notice')">更多</right>
          </div>
          <div  class="news" style="display: flex;overflow: auto;height:100%;">
            <elm-table url="/business/my/GetNoticeData"  style="max-width: 100%"  @row-click="openNotice" :show-index="false" :show-header="false" :post-data="postData" height="100%" :page-size="9999">
              <el-table-column prop="title" label="标题"  align="left">
                <template #default="{ row }">
                  <div class="title-cell">{{ row.title }}</div>
                </template>
              </el-table-column>
              <el-table-column prop="publish_time" :formatter="formatDate" label="发布时间" width="120px"  align="center"></el-table-column>
            </elm-table>
          </div>
        </el-card>
      </div>
    </div>

    <div style="height: calc(50% - 56px);">
      <div style="width: calc(70% - 6px);margin-right: 6px;float: left;height: calc(100% - 14px);">
        <el-card class="dbyb">
          <div slot="header">
            <el-radio-group v-model="showGzsxStatus" size="mini">
              <el-radio-button :label="'running'">项目工作</el-radio-button>
              <el-radio-button :label="'completed'">已处理</el-radio-button>
            </el-radio-group>
          </div>
          <div style="height:100%;display: flex;overflow: auto">
            <elm-table ref="gzsx_running"  style="max-width: 100%" v-if="showGzsxStatus=='running'" url="/business/my/GetListP_Running"  :show-index="false" :post-data="postData" height="100%">
              <el-table-column prop="pj_name" label="项目" align="center"></el-table-column>
              <el-table-column prop="name" label="工作项"  align="center"></el-table-column>
              <el-table-column prop="priority" label="优先级" width="80px" align="center"></el-table-column>
              <el-table-column prop="status" label="状态" width="80px" align="center"></el-table-column>
              <el-table-column prop="jh_start_time" label="计划开始时间" :formatter="formatDateTime" width="160px" align="center"></el-table-column>
              <el-table-column prop="jh_end_time" label="计划结束时间" :formatter="formatDateTime" width="160px" align="center"></el-table-column>
              <el-table-column label="处理" width="80px" align="center">
                <template v-slot="scope">
                  <elm-open-button url="/business/pmis/pj_task_edit_some" width="1000" height="90%" title="处理"
                                   :data="{ model: scope.row ,'table_ref':'gzsx_running'}"
                                   type="text">处理</elm-open-button>
                </template>
              </el-table-column>
            </elm-table>
            <elm-table ref="gzsx_completed"  style="max-width: 100%" v-if="showGzsxStatus=='completed'" url="/business/my/GetListP_Completed"  :show-index="false" :post-data="postData" height="100%">
              <el-table-column prop="pj_name" label="项目" align="center"></el-table-column>
              <el-table-column prop="name" label="工作项"  align="center"></el-table-column>
              <el-table-column prop="priority" label="优先级" width="80px" align="center"></el-table-column>
              <el-table-column prop="status" label="状态" width="80px" align="center"></el-table-column>
              <el-table-column prop="sj_start_time" label="实际开始时间" :formatter="formatDateTime" width="160px" align="center"></el-table-column>
              <el-table-column prop="sj_end_time" label="实际结束时间" :formatter="formatDateTime" width="160px" align="center"></el-table-column>
              <el-table-column label="处理" width="80px" align="center">
                <template v-slot="scope">
                  <elm-open-button url="/business/pmis/pj_task_edit_some" width="1000" height="90%" title="处理"
                                   :data="{ model: scope.row ,'table_ref':'gzsx_completed'}"
                                   type="text">处理</elm-open-button>
                </template>
              </el-table-column>
            </elm-table>
          </div>

        </el-card>
      </div>
      <div style="width: calc(30% - 6px);margin-left: 6px;float:right;height: calc(100% - 14px);">
        <el-card class="xxlist">
          <div slot="header">
            <span>新闻动态</span>
            <right style="cursor: pointer;" @click.native="openList('news')">更多</right>
          </div>
          <div class="news" style="display: flex;overflow: auto;height:100%;">
            <elm-table url="/business/my/GetNewsData"  style="max-width: 100%" :show-index="false" @row-click="openNews" :show-header="false" :post-data="postData" height="100%" :page-size="9999">
              <el-table-column prop="title" label="标题"  align="left">
                <template #default="{ row }">
                  <div class="title-cell">{{ row.title }}</div>
                </template>
              </el-table-column>
              <el-table-column prop="publish_time" :formatter="formatDate" label="发布时间" width="120px"  align="center"></el-table-column>
            </elm-table>
          </div>
        </el-card>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  extends: elmVueBase,
  data() {
    return {
      flow_loading:true,
      flowList:[],

      showTaskStatus:'running',

      showGzsxStatus:'running',

      images: [],
      currentIndex: 0,
      carouselWidth: 0,
    }
  },
  computed:{
  },
  async created() {
    await this.getImg();
  },
  mounted() {
    this.getFlow();
  },
  methods: {
    openList(type)
    {
      window.open("/view/my/infoview?area=infolist&type="+type);
    },
    async openNews(row, column, event)
    {
       window.open("/view/my/infoview?area=infoview&news="+row.id);
       var res= await elm.post('/business/my/GetNews',{id:row.id});
       await elm.post('/business/my/UpdateNewsViews',{id:row.id,views:res.views+1});
    },
    async openNotice(row, column, event)
    {
      window.open("/view/my/infoview?area=infoview&notice="+row.id);
      var res= await elm.post('/business/my/GetNotice',{id:row.id});
      await elm.post('/business/my/UpdateNoticeViews',{id:row.id,views:res.views+1});
    },
    async getFlow(){
      this.flow_loading = true;
      let flowList = await elm.post('/system/login/flow/GetAllFlowCodeWithSecFrom', {});
      for(let i=0;i<flowList.length;i++){
        let item = flowList[i];
        item['icon'] = "/api/system/login/io/Viewer/flow_icon/"+item['code'];
      }
      this.flowList = flowList;
      this.flow_loading = false;
    },

    async v_getData(){},
    em: function (s) {
      if (s == null || s == '') { return true; }
      else { return false; }
    },

    async getImg(){
      var res= await elm.post('/business/my/GetImgData',{});
      var minNum=5;
      if(res.length<minNum)
        minNum=res.length;
      for(var i=0;i<minNum;i++)
      {
        this.images[i]=res[i];
        this.images[i].src="/api/system/login/io/Viewer/biz_cms_news_files/"+res[i].id;
      }
    },
  }
}
</script>
<style>
.studio
{
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  overflow: auto;
}
.studio.elm-edit .el-card {
   margin: 0px;
}
.studio  .news .el-table--border, .studio  .news .el-table--group , .studio  .news .el-table td.el-table__cell{
  border: 0px solid #EBEEF5;
}
.studio  .news .el-table::before {
  display: none;
}
.studio  .news .el-table::after {
  display: none;
}
.studio .news .el-table .cell
{
cursor: pointer;
}
.dbyb,.xxlist
{
  height: 100%;
}
.dbyb .el-card__body, .xxlist .el-card__body
{
  height: calc(100% - 50px);
}
.dbyb .el-card__header{padding: 5px !important;}

.carousel-item {
  min-width: 100%;
}

.carousel-item img {
  width: 100%;
  height: auto;
}

.title-cell {
  white-space: nowrap;      /* 防止换行 */
  overflow: hidden;         /* 隐藏溢出的文本 */
  text-overflow: ellipsis;  /* 显示省略号 */
  max-width: 100%;          /* 确保容器不会超出表格 */
}
</style>